<template>
     <el-row type="flex" justify="center" class="tac" style="margin-top:50px;margin-bottom: 300px">
         <el-col :span="18">
             <el-row  :gutter="20" >
                 <el-col v-for="(test,index) in testList" :key="index"
                  :span="6" style="margin-bottom: 20px;text-align: center">
                     <el-card shadow="hover">
                         <!-- 图片 -->
                        <el-row>
                            <el-image
                            style="width: 100px; height: 100px;border-radius:50%"
                            :src="require('~/assets/image/classes.png')"
                            fit="cover"></el-image>
                        </el-row>
                        <!-- 考试名称 -->
                        <el-row style="margin: 10px auto"><span>{{test.name}}</span></el-row>

                        <!-- 考试开始时间 -->
                        <el-row style="margin: 10px auto"><time class="time" >开始时间：{{test.startTime}}</time></el-row>

                        <!-- 考试结束时间 -->
                        <el-row style="margin: 10px auto"><time class="time" >截止时间：{{test.endTime}}</time></el-row>

                        <el-row v-if="new Date().getTime() > Date.parse(test.startTime)">
                            <router-link :to="{name:'exam-id',params:{id:test.paperId,testId:test.id}}"><el-link type="success" >进入考试</el-link></router-link>
                        </el-row>
                        <el-row v-if="new Date().getTime() < Date.parse(test.startTime)">
                            <el-link type="success" disabled>还未到时间</el-link>
                        </el-row>
                    </el-card>
                 </el-col>
             </el-row>
         </el-col>
    </el-row>
</template>
<script>
import studentApi from '@/api/studentApi';
export default {
    asyncData({params}){
        return studentApi.getTestListByClassId(params.cid,params.userId).then(response =>{
            return {
                testList:response.data.data,
            }
        })
        
    },

    data(){
        return{
            isDisabled:true,
            user:null,
        }
    },

    created () {
        
    },

    methods:{


        
    }
}
</script>
